<template>
  <base-layout
    dialog-title="新增卡种"
    :dialog-visible="dialogVisible"
    dialog-width="600px"
    :page-show="pageShow"
    @dialog-close="dialogClose"
  >
    <template #toolPanel />
    <template #searchPanel>
      <search-panel :show-add-button="false" labelWidth="73" :show-search-button="true"
                    @search="search"
                    :showExportDataButton="true" @exportData="exportdataRechargeRecord" :left="false">
        <el-form-item label="渠道商:" prop="useruuid" v-if="isCompetence">
          <el-select v-model="filters.useruuid" placeholder="请选择渠道商" clearable filterable>
            <el-option value="0" label="全部">全部</el-option>
            <el-option
              v-for="item in users"
              :key="item.user.useruuid"
              :label="item.user.username"
              :value="item.user.useruuid">
            </el-option>
          </el-select>
        </el-form-item>
        <!--<el-form-item>-->
        <!--<el-input v-model="filters.rechargeamount" placeholder="充值金额"></el-input>-->
        <!--</el-form-item>-->
        <el-form-item label="开始时间:">
          <el-date-picker type="date" placeholder="开始时间" clearable format="yyyy-MM-dd" v-model="filters.rechargetime"
                          style="width: 100%;"></el-date-picker>
        </el-form-item>
        <el-form-item label="结束时间:">
          <el-date-picker type="date" placeholder="结束时间" clearable format="yyyy-MM-dd" v-model="filters.endtime"
                          style="width: 100%;"></el-date-picker>
        </el-form-item>
      </search-panel>
    </template>
    <template #contentPanel>
      <data-table
        :value="tableData"
        :total-count="totalCount"
        :has-action="false"
        :current="start"
        :table-column-attributes="tableColumnAttributes"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      >
        <template #action="{row}">
        </template>
      </data-table>
    </template>

    <template #dialog>
    </template>

  </base-layout>
</template>

<script>
  import baseMixin from '@/mixins/base'
  import { findRechargeRecord ,exportdataRechargeRecord} from '@/api/downapi'
  import { findAllPro,findAllDownShopInfo } from '@/api/utilsapi'
  import util from "../../../utils/util";

  export default {
    name: 'invitationRecord',
    mixins: [
      baseMixin({
        idName: 'id',
        refresh: '',
        findData: findRechargeRecord,
        format(res) {
          return res.map(data => {
            return data
          })
        }
      })
    ],
    data() {
      return {
        buttons: [],
        isCompetence: util.checkRoleAdminAndSuper() ? true : false,
        pageShow: true,
        dialogData:{},
        users:[],
        tableColumnAttributes: [
          { name: '渠道商名称', value: 'username',formatter : this.userNameFormatter },
          { name: '充值金额', value: 'rechargeamount' },
          { name: '充值后余额', value: 'balance' },
          { name: '充值时间', value: 'rechargetime' },
          { name: '充值类型', value: 'payType',formatter:this.formatPayType },
          { name: '充值状态', value: 'rechargestatus' , formatter:this.formatStatus },
          { name: '备注', value: 'remark' }
        ],
        filters: {
          username: '',
          rechargeamount: '',
          rechargetime: '',
          endtime:'',
          useruuid: ''
        }
      }
    },
    methods: {
      async search(form){
        let para = {
          start: 0,
          pageSize: 10,
          starttime: this.filters.rechargetime = (!this.filters.rechargetime || this.filters.rechargetime == '') ? '' : util.formatDate.format(new Date(this.filters.rechargetime), 'yyyy-MM-dd'),
          endtime:this.filters.endtime = (!this.filters.endtime || this.filters.endtime == '') ? '' : util.formatDate.format(new Date(this.filters.endtime), 'yyyy-MM-dd'),
          rechargeamount: this.filters.rechargeamount,
          useruuid: this.filters.useruuid == "0" ? "" :this.filters.useruuid
        };
        this.searchOptions = para;
        this.setTableData()
      },
      exportdataRechargeRecord(){
        let para = {
          start: this.start,
          pageSize: this.pageSize,
          starttime: this.filters.rechargetime = (!this.filters.rechargetime || this.filters.rechargetime == '') ? '' : util.formatDate.format(new Date(this.filters.rechargetime), 'yyyy-MM-dd'),
          endtime:this.filters.endtime = (!this.filters.endtime || this.filters.endtime == '') ? '' : util.formatDate.format(new Date(this.filters.endtime), 'yyyy-MM-dd'),
          rechargeamount: this.filters.rechargeamount,
          useruuid: this.filters.useruuid == "0" ? "" :this.filters.useruuid
        };
        exportdataRechargeRecord(para).then((datas) => {
          if(datas.data.path){
            window.open(data.path);
          }
        });
      },
      userNameFormatter(row){
        return row.user.username;
      },
      formatStatus: function (row) {
        return row.rechargestatus == 1 ? '充值成功' : row.sex == 0 ? '充值失败' : '未知';
      },
      formatPayType: function (row) {
        return row.payType ==  1 ? '充值' : row.payType == 2 ? '扣款' : '未知';
      } ,
      findAllDownShopInfo: function () {
        let para = {useruuid:sessionStorage.getItem("useruuid_hf")};
        findAllDownShopInfo(para).then(datas => {
          if(datas.data){
            this.users = datas.data;
          }
        });
      }
    },
    mounted() {
      this.findAllDownShopInfo();
    }
  }
</script>
